<%@ page isELIgnored="false" contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt"  prefix="fmt"%>
<html>
<head>
    <title>结果</title>
<%--    <script src="js/jquery.min.js"></script>--%>
    <script type="text/javascript"  src="${pageContext.request.contextPath}/js/jquery.min.js"></script>
<%--    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>--%>
</head>
<body>

<div>
    <div>
        <h1>欢迎登录xxx系统！</h1><br/>
        <h2>我是服务器：${pageContext.request.localPort}</h2>
        <h2>当前sessionId：${pageContext.session.id}</h2>
    </div>
    <div>
        <h1>简历信息</h1>
    </div>


    <table  id="list" border="1" cellspacing="0" cellpadding="0">
        <tr>
            <th>ID</th>
            <th>姓名</th>
            <th>地址</th>
            <th>电话</th>
            <th>操作</th>
        </tr>
    </table>
</div>
<br>
<div style="border:1px black solid">
    <h1>修改</h1>
    <input type="hidden" id="hidId"  />
    姓名：<input type="text" id="name" />
    <br>
    地址：<input type="text" id="address" />
    <br>
    电话：<input type="text" id="phone" />
    <br>
    <input type="button" id="btnSave" value="保存" />
</div>

<div style="border:1px black solid">
    <h1>新增</h1>
    姓名：<input type="text" id="name1" />
    <br>
    地址：<input type="text" id="address1" />
    <br>
    电话：<input type="text" id="phone1" />
    <br>
    <input type="button" id="btnSave1" value="保存" />
</div>

</div>
</body>
</html>


<script>


    $(function () {
        // 查询整个列表
        queryAll();

        //保存/修改
        $("#btnSave").click(function () {
            var data = JSON.stringify({
                "id":$("#hidId").val(),
                "name":$("#name").val(),
                "address":$("#address").val(),
                "phone":$("#phone").val(),
            })
            $.ajax({
                url: 'resume/add',
                type: 'POST',
                data:data,
                contentType: 'application/json;charset=utf-8',
                dataType: 'json',
                success: function () {
                    queryAll();
                }
            })
            window.location.reload();
        })

        $("#btnSave1").click(function () {
            var data = JSON.stringify({
                "name":$("#name1").val(),
                "address":$("#address1").val(),
                "phone":$("#phone1").val(),
            })
            $.ajax({
                url: 'resume/edit',
                type: 'POST',
                data:data,
                contentType: 'application/json;charset=utf-8',
                dataType: 'json',
                success: function () {
                    queryAll();

                }
            })
            window.location.reload();
        })


    })



    // 查询所有
    function queryAll() {
        clearTable();
        $.ajax({
            url: 'resume/list',
            type: 'POST',
            contentType: 'application/json;charset=utf-8',
            dataType: 'json',
            success: function (data) {
                // //生成表格数据
                $.each(data, function (index, item) {
                $('<tr id="tr' + item.id + '"><td>'
                    + item.id + '</td><td>'
                    + item.name + '</td><td>'
                    + item.address + '</td><td>'
                    + item.phone + '</td><td><input type="button" value="修改"  onclick="update('+item.id+')"/>'
                    +'<input type="button"  value="删除" onclick="del('+item.id+')"/></td></tr>').appendTo($("#list"));
                });
            }
        })
    }


    // 情况数据
    function clearTable() {
        var table = document.getElementById("list");
        var rows = table.rows.length;
        //清空表中的行和列
        for(var a=1; a<rows; a++){
            $("table tr").eq(1).remove();
        }
    }



    function update(id){

        var tds = $("#tr" + id).children('td');
        //设置文本框的值
        $("#hidId").val(tds[0].innerHTML);//隐藏域存放修改之前的行的ID编号值
        $("#name").val(tds[1].innerHTML);
        $("#address").val(tds[2].innerHTML);
        $("#phone").val(tds[3].innerHTML);
    }
    function del(id) {
        // console.log(id)
        $.ajax({
            url: 'resume/delete',
            type: 'POST',
            data:JSON.stringify({
                "id":id,
            }),
            contentType: 'application/json;charset=utf-8',
            dataType: 'json',
            success: function (data) {
                queryAll();
<%--                <jsp:forward page="/result"></jsp:forward>--%>
            },
        })

    }

</script>
